<template>
  <!--联系我们-->
  <div class="">
    <!--PC page-->
    <div class="pc_contact_page">
      <messageBoard></messageBoard>
      <!--banner-->
      <div class="banner_huoke">
        <img src="http://image.xuemei99.com/banner_pic_us_new.jpg" alt="">
      </div>

      <!--关于我们中间内容-->
      <div class="about_box">
        <div class="about_content bg_fff">
          <div class="about_our">
            <p class="font_28">关于我们</p>
            <div class="bottom_border"></div>
            <div class="contact_text_box text-left">
              学妹科技是集智能软件开发，互联网全网营销为一体的智能科技公司，一直致力于通过互联网为全国中小型企业做拓客及营销活动。从2014年成立到现在，已经服务全国3万多家中小型企业，拓客800万人次，为企业创造业绩5000多万。
              <br/>
              学妹愿景：帮助每一个企业实现利润倍增！
            </div>
          </div>

          <div class="about_our margin_top_40">
            <p class="font_28">企业文化</p>
            <div class="bottom_border"></div>
            <div class="contact_text_box text-left">
              有一种人，越是做不到的事，对他们越有吸引力，决心和信念是他们最强大的武器，这种人有三个共同特征，自信，坚决和耐力。这种人就叫做学妹人。
              <br/>
              学妹人拒绝怨天尤人，拒绝意志薄弱，拒绝平庸乏味，拒绝苟且偷生。
              <br/>
              为了实现我们心中的信念，如果困难出现，我们就要战斗到底。直到战斗到最后一个人也绝不放弃，这就是学妹人。
            </div>
          </div>

          <div class="about_our margin_top_40">
            <p class="font_28">联系我们</p>
            <div class="bottom_border"></div>
            <div class="contact_our_box margin_top_40 row">
              <div class="col-md-4 item_contact">
                <img src="http://image.xuemei99.com/phone_icon_us.png" alt="">
                <p>联系电话</p>
                <div class="bottom_border_666"></div>
                <p>021-67680297</p>
              </div>
              <div class="col-md-4 item_contact">
                <img src="http://image.xuemei99.com/address_icon_us.png" alt="">
                <p>公司地址</p>
                <div class="bottom_border_666"></div>
                <p>上海市松江区新雅创业园</p>
              </div>
              <div class="col-md-4 item_contact">
                <img src="http://image.xuemei99.com/time_icon_us.png" alt="">
                <p>营业时间</p>
                <div class="bottom_border_666"></div>
                <p>周一至周六 9:00-18:00</p>
              </div>
            </div>
          </div>

        </div>
      </div>
    </div>

    <!--mobile page-->
    <div class="bg_F4F6F9 mobile_contact_page">
      <!--banner-->
      <div class="mobile_product_banner mobile_contact_banner_bg">
        <div class="col_fff border_0"></div>
      </div>

      <!--关于我们内容区域-->
      <div class="bg_fff mobile_contact_body">
        <div>
          <p class="font_20">关于我们</p>
          <p class="margin_top20 mobile_contact_line"></p>
          <p class="margin_top_30 col_666 font_14 text-left">
            学妹科技是集智能软件开发，互联网全网营销为一体的智能科技公司，一直致力于通过互联网为全国中小型企业做拓客及营销活动。从2014年成立到现在，已经服务全国3万多家中小型企业，拓客800万人次，为企业创造业绩5000多万。
            学妹愿景：帮助每一个企业实现利润倍增！</p>
        </div>

        <!--企业文化-->
        <div class="margin_top_40">
          <p class="font_20">企业文化</p>
          <p class="margin_top20 mobile_contact_line"></p>
          <p class="margin_top_30 col_666 font_14 text-left">
            有一种人，越是做不到的事，对他们越有吸引力，决心和信念是他们最强大的武器，这种人有三个共同特征，自信，坚决和耐力。这种人就叫做学妹人。<br/> 学妹人拒绝怨天尤人，拒绝意志薄弱，拒绝平庸乏味，拒绝苟且偷生。<br/>
            为了实现我们心中的信念，如果困难出现，我们就要战斗到底。直到战斗到最后一个人也绝不放弃，这就是学妹人。</p>
        </div>

        <!--联系我们-->
        <div class="margin_top_40">
          <p class="font_20">联系我们</p>
          <p class="margin_top20 mobile_contact_line"></p>
          <div>
            <img src="http://image.xuemei99.com/phone_icon_us.png" alt="">
            <p class="col_666 font_14">联系电话</p>
            <p class="margin_top20 mobile_contact_sm_line"></p>
            <p class="padding_top_20 col_666 font_14">021-67680297</p>
          </div>

          <div>
            <img src="http://image.xuemei99.com/contact_icon_menu.png" alt="">
            <p class="col_666 font_14">公司地址</p>
            <p class="margin_top20 mobile_contact_sm_line"></p>
            <p class="padding_top_20 col_666 font_14">上海市松江区新雅创业园</p>
          </div>

          <div>
            <img src="http://image.xuemei99.com/time_icon_us.png" alt="">
            <p class="col_666 font_14">营业时间</p>
            <p class="margin_top20 mobile_contact_sm_line"></p>
            <p class="padding_top_20 col_666 font_14">周一至周六 9:00-18:00</p>
          </div>
        </div>

      </div>

    </div>

    <!--底部-->
    <Foot></Foot>
  </div>
</template>

<script>
  import Foot from '@/components/foot/foot'
  import messageBoard from '@/components/messageBoard/messageBoard'
  export default {
    name: 'huoke',
    components:{
        messageBoard,
      Foot
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .banner_huoke img{
    width: 100%;
  }
  .about_box{
    position: relative;
  }
  .about_content{
    width: 1100px;
    margin: -40px auto 40px auto;
    padding: 40px 110px;
    box-shadow: 0px 2px 8px #D8DBE2;
    border-radius: 4px;
  }
  .contact_text_box{
    border-bottom: 1px solid #EAECEF;
    padding-bottom: 40px;
    margin-top: 40px;
  }
  .item_contact img{
    width: 40px;
    height: 40px;
  }
  .item_contact p{
    font-size: 14px;
    color: #666666;
    margin-top: 12px;
  }
  .bottom_border{
    width: 40px;
    height: 2px;
    margin: 0 auto;
    background-color: #327FF0;
  }
  .bottom_border_666{
    width: 30px;
    height: 2px;
    margin: 0 auto;
    background-color: #666666;
  }
  .mobile_contact_banner_bg{
    background-image: url("http://image.xuemei99.com/banner_pic_us.png");
  }
  .mobile_contact_body{
    width: calc(100% - 30px);
    margin: -15px auto 20px auto;
    padding: 40px 15px 20px 15px;
    border-radius: 4px;
    box-shadow: 0px 2px 8px rgba(34, 35, 36, 0.15);
  }
  .mobile_contact_body img{
    width: 40px;
    margin-top: 30px;
    margin-bottom: 12px;
  }
  .mobile_contact_line{
    width: 40px;
    margin: 20px auto 0px auto;
    border-bottom: 2px solid #327FF0;
  }
  .mobile_contact_sm_line{
    width: 30px;
    margin: 20px auto 0px auto;
    border-bottom: 1px solid #666666;
  }
</style>
